html,body{width: 100%;height: 100%;padding: 0;margin: 0;color: #333;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, menu, nav, section{
    padding: 0;margin: 0;}

.icon{display: inline-block;vertical-align: text-bottom;background-image: url(../img/icon.png);background-repeat: no-repeat;width: 20px; height: 20px;background-size: 100px 100px;}
.icon-collection{width: 30px;height: 25px;background-position:8px -1px;background-color: #fff;}
.icon-no-collection{width: 30px;height: 25px;background-position:-21px -1px;background-color: #fff;}
.icon-praise{width: 25px;height: 25px;background-position: -62px 5px;}

.icon-praise-active{background-position:-63px -29px;}
.icon-no-praise{width: 25px;height: 25px;background-position: 0 0;}
.icon-comment{
    width: 22px;
    height: 22px;
    background-position: 1px -27px;
    position: relative;
    top: 1px;
    margin-right: 10px;
}
.icon-selected{background-position: -35px -30px;}
a {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
}
.article-wrap img{width: auto;height: auto;max-width: 100%;}
.article-wrap{-webkit-overflow-scrolling : touch;}
.article-wrap h1{font-size: 21px;line-height: 27px;padding: 20px 15px 0 15px;}
.article-box{width: 100%;table-layout: fixed;word-wrap: break-word;word-break: normal;}
.article-box .article-content{
    padding: 0 15px;
    font-size: 18px;
    line-height: 1.5;
}
.article-box p{font-size: 18px;line-height: 1.5;}
.article-box p.text-big-title{font-size: 17px;line-height: 25px;padding: 0 15px;font-weight: bold;}
.article-box p a,.article-thread-content a{text-decoration:none;border-bottom:1px solid #333;padding-bottom: 2px;color: #333;}
.article-box p a.a_img{border:none;padding-bottom: 0;}
.article-box p.p-img{padding: 0 0 8px 0;width: 100%;overflow: hidden;background: url("../img/bg.png") center no-repeat;}
.article-box p.p-img img{width: 100%;}
.article-box p .img-center-box img{text-align: center;}
.other-warp{padding: 0 15px;}
.head-box{display: inline-block;width: 100%;background: #fff;z-index: 10;}
.other-box{text-align: center;border-top: 1px solid #f4f4f4;margin: 25px 0 0 0;width: 100%; margin-bottom: 5px;display: inline-block;}
.other-box .author-box{
    position: relative;top: -12px;height: 25px;color: #bbb;font-size: 12px; background: #fff;
    line-height: 25px;text-align: center;display: inline-block; padding: 0 10px; }
.author-head{position: absolute;}
.author-name{margin-left: 30px;}
.other-time{float: right;}
.author-head img{width: 25px;height: 25px;border-radius: 25px;overflow: hidden;}
.collection-box{position: absolute;right: 0;margin-top: -38px;right: 15px;}
.group-author-box{text-align: center;}
.group-author-head{position: absolute;}
.group-author-head img{width: 25px;height: 25px;}
.group-author-name{margin-left: 30px;float: none;}
.group-other-time{float: none;}
.collection-box.active .icon-no-collection{
    background-position:9px -1px;
}
.praise-box{width: 80px;height: 35px;margin: 28px auto 30px auto;border:1px solid #f4f4f4;text-align: center;line-height: 35px;color: #bbb;font-size: 14px;}
.hide{display: none!important;}
.praise-box.active .icon-praise{background-position: -63px -24px;}
.praise-box-add{position: absolute;margin-top: -30px;margin-left: 25px;color: #333;opacity: 0;}
.praise-box-pl-add{margin-left: 0px;margin-top: -20px;}
a{
    color: #333;
    text-decoration: none;
}
.key-padding{
    padding: 0 15px;
}
.comment-box{border-top:1px solid #f4f4f4;padding-top: 30px;}
.group-comment-box{
    padding-top: 0px;
}
.comment-title{position: relative;font-size: 18px;height: 18px;line-height: 18px;padding-left: 2px;}
.comment-title:before{
    position: absolute;
    content: "";
    width: 0;
    border-left: 2px solid #f63756;
    bottom: 1px;
    height: 18px;
    left: -2px;
}
.pl-box{position: relative;padding: 15px 0 12px 0;border-bottom: 1px solid #f4f4f4;}
.group-pl-box{padding: 20px 0 15px 0;}
.pl-box .author-name{margin-left: 36px;}
.pl-box .author-time{
    position: absolute;
    margin-left: 110px;
}
.pl-box .icon-praise{
    width: 17px;
    height: 18px;
    background-position: -62px -1px;
}
.pl-box .icon-praise.active{background-position:-63px -29px;}
.pl-box:after{
    position: absolute;
    content: "";
    width: 0;
    border-left: 35px solid #fff;
    bottom: -1px;
    height: 1px;
}
p iframe{width: 100%;height: auto;}
.pl-user-info{font-size: 12px;color: #bbb;line-height: 25px;display: inline-block;}
.other-num{position: absolute;right: 0;}
.other-num span{margin-right: 5px;}
.other-num .number{
    margin-right: 5px;
    margin-left: 5px;
}
.pl-content{font-size: 16px;position: relative;margin-left: 35px;line-height: 24px;word-break: break-all;word-wrap: break-word;margin-top: 5px;margin-bottom: 8px;}
.pl-time{position: relative;margin-left: 35px;font-size: 12px;color: #bbb;line-height: 27px;}
.more-comment{margin-top: 20px;text-align: center;font-size: 15px;color: #999;margin-bottom: 30px;}
.to-promote{position: relative;margin-bottom: 30px;}
.tg-img-box{overflow: hidden;}
.tg-img-box img{width: 100%;}
.to-promote-content{width: 100%;-webkit-box-sizing: border-box;box-sizing:border-box;position: absolute;height: 98%;background: rgba(0, 0, 0, 0.2);color: #fff;font-size: 17px;
    line-height: 24px;padding: 15px;
}
.to-promote-content .i-to-promote{display: inline-block;font-size: 11px;font-style: normal;background: #1c95dc;height: 18px;line-height: 20px;text-align: center;padding: 0 5px;}
.to-promote-title{margin-top: 10px;}
.to-promote-title a{color: #fff;}
.article-list-warp{padding-bottom: 30px;}
.article-list-warp a{
    width: 100%;
    height: 100%;
    display: inline-block;
    /*vertical-align: middle;*/
    /*display: table-cell;*/
    /*height: 56px;*/

}
.article-list-box{padding-top: 25px;display: inline-block;width: 100%;}
.article-img-box{width: 100px;height: 56px;overflow: hidden;float: left;}
.article-img-box img{width: 100%;}
.article-title{font-size: 14px;color: #333;line-height: 19px;margin-left: 115px;}
.topic-warp{padding:0 10px;}
.topic-tag{padding: 0; margin: 17px 0 20px 0;display: inline-block;}
.topic-tag li{height: 30px;padding: 0 15px;text-align: center;font-size: 14px;color: #333;line-height: 30px;float: left;
    margin: 0 5px;background-color: #f9f9f9;border: 1px solid #f2f2f2;margin-bottom: 10px;list-style-type: none;}

/*收藏夹*/
.modal-dialog{
    position: absolute;-webkit-box-sizing:border-box;box-sizing: border-box;box-sizing: border-box;width: 100%;height: 100%;background-color: rgba(22, 48, 81, 0.5);z-index: 100;
    padding: 0 35px;display: none;
}
.modal-content{
    position: relative;height: 296px;background-color: #fff;width: 100%;top:50%;margin-top: -148px;display: none;
}
.modal-header{height: 45px;line-height: 45px;background-color: #f5f5f5;font-size: 17px;color: #333;text-align: center;}
.modal-body{height: 195px;-webkit-box-sizing:border-box;box-sizing: border-box;width: 100%;padding: 20px;overflow: auto;}
.modal-footer{height: 55px;border-top: 1px solid #f4f4f4;}

.btn-footer-left,.btn-footer-right{width: 50%;text-align: center;line-height: 55px;font-size: 15px;float: left;}
.btn-footer-left{}
.btn-footer-right{color: #0da3fa;}
.collection-warp{position: relative;height: 65px;border:1px solid #f0f0f0;border-left:2px solid #7dc3f9;margin-bottom: 20px;padding-left: 15px;}
.collection-warp:last-child{margin-bottom: 0px;}
.collection-name{font-size: 15px;color: #333;line-height: 24px;margin-top: 10px;}
.collection-number{font-size: 12px;color: #bbb;line-height: 24px;}
.collection-right{
    position: absolute;
    right: 15px;
    top: 50%;
    margin-top: -10px;
}
